<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Document</title>
		<style>
			.menu{
				cursor: pointer;
			}
		</style>
		<script>
			function dian(thisa){
				nextNode = thisa.nextElementSibling;
				if(nextNode.style.display=='none'){
					nextNode.style.display='block';
				}else{
					nextNode.style.display='none';
				}
			}
			
			
			// 实验2/
			
			var w = window.innerHeight;
			var h = window.innerHeight;
			var oh = window.outerHeight;
			alert(w+'-----'+h+'====='+oh)
			
			window.onload=function(){
				document.bgColor = 'pink'
				document.fgColor = "#0000ff"
			}
		</script>
	</head>
	<body>
		<ul>
			<li class="menu" onclick="dian(this)">导航一</li>
			<li style="display: none;">
				<a href='JavaScript:void();'>菜单1</a><br>
				<a href='JavaScript:void();'>菜单2</a><br>
				<a href='JavaScript:void();'>菜单3</a><br>
				<a href='JavaScript:void();'>菜单4</a><br>
				<a href='JavaScript:void();'>菜单5</a><br>
			</li>
			<li class="menu" onclick="dian(this)">导航二</li>
			<li style="display: none;">
				<a href="JavaScript:void();">菜单6</a><br>
				<a href="JavaScript:void();">菜单7</a><br>
				<a href="JavaScript:void();">菜单8</a><br>
				<a href="JavaScript:void();">菜单9</a><br>
				<a href="JavaScript:void();">菜单10</a><br>
			</li>
			<li class="menu" onclick="dian(this)">导航三</li>
			<li style="display: none;">
				<a href="JavaScript:void();">菜单11</a><br>
				<a href="JavaScript:void();">菜单12</a><br>
				<a href="JavaScript:void();">菜单13</a><br>
				<a href="JavaScript:void();">菜单14</a><br>
				<a href="JavaScript:void();">菜单15</a><br>
			</li>
		</ul>
	</body>
</html>
